/*Importing font for the page titles*/
@font-face {
    font-family:Diplomata;
    src:url('fonts/Diplomata-Regular.ttf');
}

/*Background Image Formatting*/
html {
    background: url(http://www.veectors.com/vector-images/00/02/01/59/classic-text-background-vector-background-veectors-20159.jpg) no-repeat center center fixed;
    background-size: cover;
}

body {
/*    background-image: url('img/background2.jpg');*/
/*    background-size:100%;*/
/*	background-color: #e0cd9b;*/
	font-family: sans-serif;
}

/*Website-wide title and subtitle formatting*/
.title {
    text-align: center;
    font-family: Diplomata;
    font-size: 3em;
    padding-top: 2em;
    padding-bottom: 1.25em;
}

.subtitle {
    text-align: center;
	font-family:sans-serif;
	font-size: 2.5em;
}

/*Back Button*/
#back {
    float:left;
    position: absolute;
    left: 0%;
    top: 5%;
	text-align: center;
	height: 1.2em;
	width: 4em;
	
	text-decoration: none;
	font-size: 40px;
	border-radius: 0.6em;
	border: 2px solid black;
	
	color: black;
	background-color: white;
}

#back:hover {
	background-color: #1b5bd7;
	border: 2px solid white;
	color: white;
}

/* language select */
#left {
    float:left;
    position: absolute;
    left: 15%;
    height: 15%;
    width: 27%;
	
	font-size: 3em;
	border-radius: 0.6em;
	border: 2px solid black;
	
	background-color: white;
}

#right {
    float: right;
    position: absolute;
    right: 15%;
    height: 15%;
    width: 27%;
	
	font-size: 3em;
	border-radius: 0.6em;
	border: 2px solid black;
	
	background-color: white;
}


#right:hover {
	background-color: #1b5bd7;
	border: 2px solid white;
	color: white;
}

#left:hover {
	background-color: #1b5bd7;
	border: 2px solid white;
	color: white;
}

/*Manager View Button*/
#manager {
	position: absolute;
	right: 25px;
	top: 25px;
}

form {
    font-size: 15pt;   
}

/* most of the buttons */
input[type="submit"] {
	height: 2em;
	/* width: 10em; */
	font-size: 2em;
	
	border-radius: 0.6em;
	border: 2px solid black;
	
	background-color: white;
}

input[type="submit"]:hover {
	background-color: #1b5bd7;
	color: white;
	border: 2px solid white;
}
input[type="submit2"] {
	height: 1em;
	/* width: 10em; */
	font-size: 1em;
	
	border-radius: 0.4em;
	border: 1px solid black;
	
	background-color: white;
}


input[value="Help"] {
	float: right;
	position: absolute; 
	right: 1%;
	top: 5%;
	background-color: red;
	color: white;
	border: 2px solid white;
}
input[value="Call for a Manager"] {
	float: right;
	position: absolute; 
	right: 1%;
	top: 13%;
	background-color: black;
	color: white;
	border: 2px solid white;
}

input[value="START"] {
	background-color: yellow;
}

input[value="COMPLETE"] {
	background-color: green;
}

input[value="DELETE"] {
	background-color: red;
}


input[value="Ayuda"] {
	float: right;
	position: absolute; 
	right: 5%;
	top: 5%;
	background-color: red;
	color: white;
	border: 2px solid white;
}

form[method="post"] input[type="submit"]{
	font-size: 1em;
}

input[type="text"] {
	
	font-size: 1em;
}

input[type="password"] {
	
	font-size: 1em;
}

.center {
    margin-left: auto;
    margin-right: auto;
    padding: 0% 33% 0% 33%;
}

/*Menu Formatting*/
#accordion {
    font-size: 1.3em;
    float: left;
    clear:both;
    width: 50%;
}

.lineHeader {
    text-align: left;
    font-size: 14pt;
}

.lineOrder {
    text-align: left;
    font-size: 12pt;
}

.lineCost{
    text-align: left;
    font-size: 13pt;
}

.form {
    text-align: left;
    padding-left: 20%;    
}

#orderSummary {
    float: right;
    background-color: grey;
    opacity:0.7;
    filter:alpha(opacity=40); /* For IE8 and earlier */
    border-style: solid;
    border-width: 5px;
    margin-right: 10%;
    width: 600px;
    height: 425px;
    overflow: auto;
}

#summaryHeader {
    font-size: 15pt;
    text-align: center;
}

#kitchenWrapper {
    width: 90%;
    height: 500px;
    margin-left: 5%;
    margin-right: 5%;
/*    overflow: auto;*/
/*    display: inline-block;*/
}

.orderItem {
    width: 300px;
    height: 500px;
    background-color: grey;
    border-style: solid;
    border-width: 3px;
    overflow: auto;
}

/*Manager View Formatting*/
#tabs ul {
	padding: 0px;
	margin: 0px;
	margin-left: 10px;
	list-style-type: none;

}

#tabs ul li {
	display: inline-block;
	clear: none;
	float: left;
	height: 24px;
	
}

#tabs ul li a {
	position: relative;
	margin-top: 16px;
	display: block;
	margin-left: 6px;
	line-height: 24px;
	padding-left: 10px;
	background: #f6f6f6;
	z-index: 9999;
	border: 1px solid #ccc;
	border-bottom: 0px;
	-moz-border-radius-topleft: 4px;
	border-top-left-radius: 4px;
	-moz-border-radius-topright: 4px;
	border-top-right-radius: 4px;
	width: 130px;
	color: #000000;
	text-decoration: none;
	font-weight: bold;
	
}

#tabs ul li a:hover {
	text-decoration: underline;

}

#tabs #Content_Area {
	padding: 0 15px;
	clear:both;
	/*overflow:hidden;*/
	line-height:19px;
	position: relative;
	top: 20px;
	z-index: 5;
	/*height: 150px;*/
	overflow: hidden;
	
}
#formWrapper {
    margin-left:20%;
}

.startButton {
    float:left;
}

.completeButton {
    float:right;
}
